“InfyWeb App” Documentation by “InfyOm Technologies” v1.0


“InfyWeb App”

Created: 15/08/2022
By: InfyOm Technologies
Email: labs@infyom.in

Thank you for purchasing my code. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!


Overview

  1. Description
  2. Get Started
  3. Code Structured


A) Description

InfyWeb App is convert your web in android and iOS app, which gives developers to integrate functionality directly. This Web app can be useful for any type of Website url to convert Flutter app.

Specifications:

- Developer in Flutter(3.0.5) + GetX + Route Management
- Supported Device : Android and iOS
- Code Structured : Folder Structured
- Assign App logo
- Upload and Download file
- Some assets are included
- Push notification include(One Signal)
- Firebase Database support
- Pull to refresh functionality implement
- Easy to customize
- Geolocation included
- Easy to convert your website into apps
- More theme included
- Documentation included

Welcome screens

HTML Structure

Home screen

HTML Structure

Setting screen

HTML Structure




B) Get Started - top

After you download you can get InfyWeb.zip in InfyWeb.zip you can see Documentation and you can extract all files in folder this,How to open project InfyWeb flutter app in your pc or laptop :

1) You can extract file rar and get InfyWeb app template
2) If you not yet install Flutter plugin for Android studio: https://flutter.io/get-started/editor/ if you done install flutter skip this step
3) Open Android Studio or Visual Studio
4) Open InfyWeb app by using one of below methods:

HTML Structure

Or

HTML Structure



How to Clean Code - top

After you open this flutter template file:

if your code messy like this :

HTML Structure

You can follow these tips in android studio for windows user to change the code to clean


1) CTRL + a (after that)

2) CTRL + Shift + -


HTML Structure

I hope that can help you


if your code messy like this :

HTML Structure


You can follow these tips for visual studio to change the code to clean - top

Fold folds the innermost uncollapsed region at the cursor:

1) Ctrl + Shift + [ on Windows and Linux

2)⌥ + ⌘ + [ on macOS


Unfold unfolds the collapsed region at the cursor:

1) Ctrl + Shift + ] on Windows and Linux

2)⌥ + ⌘ + ] on macOS


Fold All folds all regions in the editor:

1) Ctrl + K, Ctrl + 0 (zero) on Windows and Linux

2)⌘ + K, ⌘ + 0 (zero) on macOS


Unfold All unfolds all regions in the editor:

1) Ctrl + K, Ctrl + J on Windows and Linux

2)⌘ + K, ⌘ + J on macOS




Firebase SetUp

Creating a new Firebase project :

- Go to Firebase console.

- Sign in with your Google account.

- Click on Add project.

- Enter a Project name and click Continue.

- Turn off Google Analytics for this project and click Create project.

- Wait for the creation process to complete, and then click Continue.

HTML Structure

Then after register your flutter app in firebase with Firebase CLI :

- If you not yet install FlutterFire CLI for Android studio: https://firebase.google.com/docs/flutter/setup?platform=android

- If you done install flutterCLI skip this step.

- Then you can set firebase firestore Database with this link https://console.firebase.google.com/

- Then you can create database reference for set url in web view

HTML Structure

- Make true read & write rules of firestore database

HTML Structure



API Integration

- Open Project in Android Studio

- Go to lib/api_call Folder

- Open the file get_all_api.dart.

- Set Your Base URL as per below image:

HTML Structure

- Then after delete below files from Project:

  • lib/api_call/get_all_api.g.dart
  • lib/model/about_app_configuration_api/about_app_configuration_model.g.dart
  • lib/model/data_api/data_model.g.dart
  • lib/model/exit_popup_configuration_api/exit_popup_configuration_model.g.dart
  • lib/model/onboarding_title_api/onboarding_title_model.g.dart
  • lib/model/onesignal_configuration_api/onesignal_configuration_model.g.dart
  • lib/model/progress_bar_style_api/progress_bar_style_model.g.dart
  • lib/model/share_content_api/share_content_model.g.dart
  • lib/model/splash_screen_api/splash_model.g.dart
  • lib/model/theme_style_api/theme_style_model.g.dart

  • - After that run this command in terminal: dart run build_runner build


    One Signal Notification SetUp Android & IOS

    Creating a new project in One signal dashboard :

    - Go to Onesignal dashboard.

    Then after register your flutter app in One signal:

    - If you not yet setup One signal SDK for Android studio: https://documentation.onesignal.com/docs/flutter-sdk-setup

    HTML Structure

    Then after change app id in Android Studio :

    HTML Structure



    C) Code Structured - top

    In folder InfyWeb template you can see some folder flutter project, dont worry about all sub folder project in flutter, if you can see folder lib it is place for code .dart in flutter project, in folder lib have four folder :

    Component

    HTML Structure
    Image for list item folder

    Screen folder use for storage file to save data a list

    - HomeScreen folder to place part of the home screen design.

    - In app web view folder for placing parts of a all web url support screen.

    - OnBoarding screen to put part of intro for InfyWeb app.

    - Setting folder to put part of the component chnage theme and about screen.

    - Splash folder to put part of the component Splash screen.

    - Theme folder to put part of the Change app theme.

    Assets

    HTML Structure
    image for assets item folder

    - Image folder for saving all images

    - Font folder for saving all fonts


    Pusbec.yaml

    HTML Structure image puspec.yaml this theme

    Pub packages that are shared with others also need to provide some other information so users can discover them. Every package needs a name. It's how other packages refer to yours, and how it appears to the world, should you publish it. In puspec.yaml you can write your location image after you adding to apps, and you can custom font from external apps dont worry it is very easy to use custom font.



    Once again, thank you so much for purchasing this InfyWeb app. As I said at the beginning, I'd be glad to help you if you have any questions relating to this code. If you have a more general question to may email labs@infyom.in.

    InfyOm Technologies

    Go To Overview